<template>
  <div class="front-desk">
    <theNav></theNav>
    <div class="app-box">
      <div class="router-view" v-for="(item,index) in childArr" :key="index" v-html="item.content"></div>
    </div>
  </div>
</template>

<script>
import {mapState} from 'vuex'
import theNav from './theNav'
  export default {
    computed: {
      ...mapState(['childArr'])
    },
    components:{
      theNav
    }
  }
</script>

<style lang="scss" scoped>
.front-desk{
  height: 100vh;
  .app-box{
    height: calc(100% - 60px);
    display: flex;
    .router-view{
      width: 50%;
      height: 100%;
      box-sizing: border-box;
      &:first-child{
        border-right: 1px solid #ddd;
      }
      >div{
        width: 100%;
      }
    }
  }
}
</style>